  <div class="modal-body">
    <style>
      .timepicker-to-column {
        margin-top: 10px;
      }

      .timepicker-input input {
        outline: 0 !important;
        border: 0px !important;
        -webkit-box-shadow: 0;
        -moz-box-shadow: 0;
        box-shadow: 0;
        position: relative;
      }

      .timepicker-input input::-webkit-outer-spin-button,
      .timepicker-input input::-webkit-inner-spin-button {
          -webkit-appearance: none;
          margin: 0;
      }

      input.timepicker-date {
        width: 90px;
      }
      input.timepicker-hms {
        width: 20px;
      }
      input.timepicker-ms {
        width: 25px;
      }
      div.timepicker-now {
        float: right;
      }
    </style>

    <div class="timepicker form-horizontal">
        <form name="input">

        <div class="timepicker-from-column">
          <label class="small">From</label>
          <div class="fake-input timepicker-input">
            <input class="timepicker-date" type="text" ng-change="validate(temptime)" ng-model="temptime.from.date" data-date-format="yyyy-mm-dd" required bs-datepicker />@
            <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.hour" required ng-pattern="patterns.hour" onClick="this.select();"/>:
            <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.minute" required ng-pattern="patterns.minute" onClick="this.select();"/>:
            <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.from.second" required ng-pattern="patterns.second" onClick="this.select();"/>.
            <input class="timepicker-ms" type="text" maxlength="3" ng-change="validate(temptime)" ng-model="temptime.from.millisecond" required ng-pattern="patterns.millisecond"  onClick="this.select();"/>
          </div>
        </div>

        <div class="timepicker-to-column">

          <label class="small">To (<a class="link" ng-class="{'strong':panel.now}" ng-click="setNow();panel.now=true">now</a>)</label>

          <div class="fake-input timepicker-input">
            <div ng-hide="panel.now">
              <input class="timepicker-date" type="text" ng-change="validate(temptime)" ng-model="temptime.to.date" data-date-format="yyyy-mm-dd" required bs-datepicker />@
              <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.hour" required ng-pattern="patterns.hour" onClick="this.select();"/>:
              <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.minute" required ng-pattern="patterns.minute" onClick="this.select();"/>:
              <input class="timepicker-hms" type="text" maxlength="2" ng-change="validate(temptime)" ng-model="temptime.to.second" required ng-pattern="patterns.second" onClick="this.select();"/>.
              <input class="timepicker-ms" type="text" maxlength="3" ng-change="validate(temptime)" ng-model="temptime.to.millisecond" required ng-pattern="patterns.millisecond" onClick="this.select();"/>
            </div>
            <span type="text" ng-show="panel.now" ng-disabled="panel.now">&nbsp <i class="pointer icon-remove-sign" ng-click="setNow();panel.now=false"></i> Right Now <input type="text" name="dummy" style="visibility:hidden" /></span>
          </div>
        </div>

        </form>
        <div class="clearfix"></div>
    </div>
  </div>

  <div class="modal-footer">
    <form name="input" style="margin-bottom:0">
    <span class="" ng-hide="input.$valid">Invalid date or range</span>
    <button ng-click="setAbsoluteTimeFilter(validate(temptime));dismiss();" ng-disabled="!input.$valid" class="btn btn-success">Apply</button>
    <button ng-click="dismiss();" class="btn btn-danger">Cancel</button>

    </form>
  </div>
